<template>
	<view class="home-container">
		<!-- 未登录状态 -->
		<template v-if="!islogin">
			<view class="login-title u-f u-f-ac">登录仿糗事百科，体验更多功能</view>
			<!-- 第三方登录 -->
			<other-login></other-login>
			<!-- 账号密码登录 -->
			<view class="login-zhanghao u-f u-f-ac">
				<text  @tap="openLogin">账号密码登录</text>
				<view class="icon iconfont icon-jinru"></view>
			</view>
		</template>
		<template v-if="islogin">
			<home-info :homeinfo="homeinfo"></home-info>
		</template>
		<!-- 数据 -->
			<home-data :homedata="homedata"></home-data> 
		
		<!-- 广告位 -->
		<view class="home-ad">
			<image src="../../static/demo/demo20.jpg" lazy-load mode="widthFix"></image>
		</view>
		
		<!-- 功能列表 -->
		<view class="home-list"> 
			<block v-for="(item,index) in list" :key="index">
				<home-list-item :item="item" :index="index"></home-list-item>
			</block>
		</view>
	</view>
</template>

<script>
	import homeListItem from '../../components/home/home-list-item.vue'
	import homeInfo from '../../components/home/home-info.vue'
	import homeData from '../../components/home/home-data.vue'
	import otherLogin from '../../components/home/other-login.vue'
	export default {
		components:{
			homeListItem,
			homeInfo,
			homeData,
			otherLogin
		},
		data() {
			return {
				islogin:false,
				homedata:[
					{name:'糗事',num:0},
					{name:'动态',num:0},
					{name:'评论',num:0},
					{name:'收藏',num:0},
				],
				homeinfo:{
					userpic:"../../static/demo/userpic/6.jpg",
					username:"史威权",
					totalnum:0,
					todaynum:0
				},
				list :[
					{icon:"liulan" , name:'浏览历史',color:'#68C1FF',clicktype:"",url:""} ,//FFCDB7
					{icon:'huiyuanvip',name:'糗百认证', color:"#FF7434",clicktype:"",url:""},
					{icon:"icon_im_keyboard" , name:'审核糗事',color:'#68C1FF',clicktype:"",url:""}
				]
			}
		},
		onNavigationBarButtonTap(e){
			if(e.index === 0){
				uni.navigateTo({
					url:"../user-set/user-set"
				})
			}
		},
		methods: {
			openLogin(){
				uni.navigateTo({
					url:"../login/login"
				})
			}
		}
	}
</script>

<style>
	.home-container {
		padding: 0 20upx;
	}
	
	.home-ad { 
		margin-top: 20upx;
		border-bottom: 1upx solid #F9F9F9;
	}
	.home-ad > image { 
		width: 100%;
		border-radius: 20upx;
		height:180upx;
	}
	.home-list {
		padding: 0 20upx;
	}
	/* .home-list-item {
		padding: 20upx ;
		border-bottom: 1upx solid #F9F9F9;
	}
	.home-list-item > view:first-child>view{
		margin-right: 10upx;
		color:#56BAFF;
	} 
	.home-list-item > view:last-child{
		color:#C7C7C7;
	} */
	
	/* 登录状态 */
	
</style>
 